<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>购物网</title>
<style type="text/css">
	*{
		padding:0;
		margin:0 auto;}
	body{
		width:940px;
		height:1188px;
		border:9px solid #FCC;}
	ul li{
		list-style:none;}
	.header{
		width:940px;
		height:40px;
		background-color:#C06;}
	.header ul li.a1,.a2,.a3,.a4,.a5{
		float:left;
		padding:5px;}
	.header ul li.a1{
		margin-left:20px;}
	.header ul li.a6{
		float:right;
		color:#FFF;
		font-weight:bold;
		margin-right:20px;
		line-height:40px;}
	.header ul li.a6 a{
		color:#F6F;}
	.part1{
		width:940px;
		height:100px;
		background-color:#ecbde7;}
	.part1 ul li.b1{
		position:relative;
		right:295px;
		top:15px;
		}
	.part1 ul li.b2{
		float:right;
		position:relative;
		bottom:73px;
		}
	.part2{
		width:940px;
		height:230px;
		background-color:#fff;
		margin-top:25px;}
	.part2 ul li.b3{
		width:630px;
		height:190px;
		float:left;
		position:relative;
		bottom:-5px;
		left:30px;}
	.part2 ul li.b4{
		float:left;
		position:relative;
		left:50px;
		bottom:76px}
	.part3{
		background-color:#603;
		height:720px;}
	.part3 .c1{
		height:40px;
		background-color:#300;}
	.part3 .c1 ul{50
		width:940px;
		height:40px;}
	.part3 .c1 ul li{
		display:inline-block;
		height:28px;
		width:148px;
		position:relative;
		top:-65px;
		line-height:28px;
		text-align:center;
		border-right:1px solid #666;}
	.part3 .c1 ul li.c2 a{
		color:#fff;
		font-weight:bold;
		text-decoration:none;}
	.part3 .d{
		width:620px;
		height:270px;}
	.part3 .d h2{
		color:#fff;
		position:relative;
		right:135px;}
	.part3 .d p.d1{
		color:#fff;
		position:relative;
		right:135px;
		margin-top:20px;
		font-size:15px;}
	.part3 .d p.d1 a{
		color:#F9C;}
	.part3 .d p.d2{
		color:#fff;
		position:relative;
		right:135px;
		margin-top:10px;
		font-size:15px;}
	.part3 .e{
		width:630px;
		height:40px;
		background-color:#300;
		position:relative;
		top:30px;
		right:130px;}
	.part3 .e ul li.e1{
		color:#fff;
		font-size:26px;
		line-height:40px;
		position:relative;
		left:20px;}
	.part3 .e2 .x ul{
		width:200px;
		height:285px;
		position:relative;
		top:55px;
		right:345px;
		color:#fff;}
	.part3 .e2 .x{
		float:left;
		margin-left:15px;
		position:relative;
		left:355px;
	}
	.part3 .e2 .x ul li.x1{
		background-color:#F6C;
		font-weight:bold;
		line-height:30px;
		height:30px;
		font-size:16px;
		margin-bottom:10px;
		}
	.part3 .e2 .x ul li.x1 front{
		position:relative;
		left:10px;}
	.part3 .e2 .x ul li.x3{
		font-size:14px;}
	.part3 .e2 .x ul li.x4{
		font-size:18px;
		line-height:32px;}
	.part3 .e2 .x ul a{
		color:#F6F;
		position:relative;
		left:100px;
		bottom:23px;
		font-size:18px;}
	.part3 .e2 .x ul li.x5{
		height:25px;
		font-weight:bold;
		line-height:25px;
		text-align:center;
		width:80px;
		font-size:12px;
		color:#fff;
		margin-left:1px;
		background:rgb(191,70,124);
		border-bottom:1px solid rgb(223,109,161);;}
	.part3 .e2 .y{
		float:right;
		position:relative;
		bottom:280px;
		right:25px;
		width:220px;
		height:130px;
		background-color:rgb(235,188,230);
		border:#FCC 6px solid;}
	.part3 .e2 .y ul li.y1{
		background-color:rgb(190,69,123);
		width:220px;
		height:28px;}
	.part3 .e2 .y ul li.y1 p{
		color:#fff;
		font-size:20px;
		line-height:25px;
		position:relative;
		left:10px;}
	.part3 .e2 .y ul li.y2{
		position:relative;
		top:20px;
		left:15px;}
	.part3 .e2 .y ul li.y2 input{
		width:190px;
		height:20px;}
	.part3 .e2 .y ul li.y3{
		position:relative;
		top:40px;
		left:15px;}
	.part3 .e2 .y ul li.y3 input{
		width:50px;
		height:20px;}
	.part3 .e2 .z{
		background-color:rgb(235,188,230);
		border:#FCC 6px solid;
		width:220px;
		height:270px;
		float:right;
		position:relative;
		bottom:250px;
		right:25px;}
	.part3 .e2 .z ul li.z1{
		background-color:rgb(190,69,123);
		width:220px;
		height:28px;}
	.part3 .e2 .z ul li.z1 p{
		color:#fff;
		font-size:20px;
		line-height:25px;
		position:relative;
		left:10px;}
	.part3 .e2 .z ul li.z2{
		position:relative;
		top:15px;
		left:15px;
		font-size:14px;
		color:rgb(190,69,123);
		font-weight:bold;
		line-height:22px;}
	.part3 .e2 .z ul li.z2 font{
		position:relative;
		left:10px;}
	.part3 .e2 .w3c{
		background-color:rgb(235,188,230);
		border:#FCC 6px solid;
		width:220px;
		height:110px;
		float:right;
		position:relative;
		top:-80px;
		left:205px;}
	.part3 .e2 .w3c ul li.w3c1{
		background-color:rgb(190,69,123);
		width:220px;
		height:28px;}
	.part3 .e2 .w3c ul li.w3c1 p{
		color:#fff;
		font-size:20px;
		line-height:25px;
		position:relative;
		left:10px;}
	.part3 .e2 .footer{
		float:left;
		height:73px;
		width:940px;
		position:relative;
		bottom:54px;
		background-color:rgb(51,51,51);}	
	.part3 .e2 .footer ul li{
		float:left;}
	.part3 .e2 .footer ul li.footer1{
		position:relative;
		left:15px;
		top:15px;
		margin-left:5px;}
	.part3 .e2 .footer ul li.footer2{
		font-size:14px;
		color:#fff;
		position:relative;
		left:140px;
		top:25px;}
	.footer2 a{
		color:#F9F;
		font-size:12px;}
	.footer3{
		color:#666;
		position:relative;
		top:15px;
		left:40px;
		font-size:34px;}
</style>
</head>

<body>
	<div class="header">
    	<ul>
        	<li class="a1"><img src="images/templatemo_flag_01.gif"></li>
            <li class="a2"><img src="images/templatemo_flag_02.gif"></li>
            <li class="a3"><img src="images/templatemo_flag_03.gif"></li>
            <li class="a4"><img src="images/templatemo_flag_04.gif"></li>
            <li class="a5"><img src="images/templatemo_flag_05.gif"></li>
            <li class="a6">Shopping Cart(<a href="">3 items</a>)</li>
        </ul>
    </div>
	<div class="part1">
    	<ul>
        	<li class="b1"><img src="images/templatemo_site_header.jpg"></li>
            <li class="b2"><img src="images/templatemo_header_bg.jpg"></li>
        </ul>
    </div>
    <div class="part2">
    	<ul>
        	<li class="b3"><img src="images/templatemo_banner_image.jpg"></li>
            <li class="b4"><img src="images/templatemo_banner_bg.jpg"></li>
        </ul>
    </div>
   	<div class="part3">
    	<div class="c1">
        	<ul>
            	<li class="c2"><a href="">Home</a></li>
                <li class="c2"><a href="">Features</a></li>
                <li class="c2"><a href="">Gallery</a></li>
                <li class="c2"><a href="">Forum</a></li>
                <li class="c2"><a href="">About Us</a></li>
                <li class="c2"><a href="">Contact Us</a></li>
            </ul>
         </div>
         <div class="d">
         	<h2>Welcome to Our Flower Site</h2>
         	<p class="d1">When You Are Old <a href="">When you are old</a> and gray and full of sleep And nodding by the fire, take down this book, And slowly read, and dream of the soft look Your eyes had once, and of their shadows deep； How many loved your moments of glad grace, And loved your beauty with love false or true; But one man loved the pilgrim soul in you, And loved <a href="">the sorrows of</a> your changing </p>
            <p class="d2">This is my room. Near the window there is a desk. I often do my homework at it. You can see some books, some flowers in a vase, a ruler and a pen. On the wall near the desk there is a picture of a cat. There is a clock above the end of my bed. I usually put my shoe under my bed. Of course there is a chair in front of the desk. I sit there and I can see the trees and roads outside.</p>
         </div>
         <div class="e">
         	<ul>
            	<li class="e1">New Products</li>
            </ul>
         </div>
         <div class="e2">
         	<div class="x">
                <ul>
                    <li class="x1"><front>Product One</front></li>
                    <li class="x2"><img src="images/templatemo_image_01.jpg"></li>
                    <li class="x3">Aliquam tristique lacus in sapien.Suspendisse potenti.</li>
                    <li class="x4">PRICE:$14.00</li>
                    <li class="x5">BUY NOW</li><a href="">Details</a>
                </ul> 
         	 </div>
             <div class="x">
                <ul>
                    <li class="x1"><front>Product Title</front></li>
                    <li class="x2"><img src="images/templatemo_image_02.jpg"></li>
                    <li class="x3">Lorem ipsum dolor dfhjrgerd sitamet,consectetuer.</li>
                    <li class="x4">PRICE:$18.00</li>
                    <li class="x5">BUY NOW</li><a href="">Details</a>
                </ul> 
         	 </div>
             <div class="x">
                <ul>
                    <li class="x1"><front>Product Title</front></li>
                    <li class="x2"><img src="images/templatemo_image_03.jpg"></li>
                    <li class="x3">Suspendisse potenti. Ut sed pede.Nullam vitae tellus.</li>
                    <li class="x4">PRICE:$26.00</li>
                    <li class="x5">BUY NOW</li><a href="">Details</a>
                </ul> 
         	 </div>
             <div class="y">
             	<ul>
                	<li class="y1"><p>Search</p></li>
                	<li class="y2"><input type="text"></li>
                    <li class="y3"><input type="button" value="Search"></li>
                </ul>
             </div>
             <div class="z">
             	<ul>
                	<li class="z1"><p>Categories</p></li>
                    <li class="z2"><img src="images/templatemo_list_icon.gif"><font>Artificial and Silk<font></li>
                    <li class="z2"><img src="images/templatemo_list_icon.gif"><font>Dried and Preserved<font></li>
                    <li class="z2"><img src="images/templatemo_list_icon.gif"><font>Floral<font></li>
                    <li class="z2"><img src="images/templatemo_list_icon.gif"><font>Fresh Cut<font></li>
                    <li class="z2"><img src="images/templatemo_list_icon.gif"><font>Gardens<font></li>
                    <li class="z2"><img src="images/templatemo_list_icon.gif"><font>Gifts<font></li>
                    <li class="z2"><img src="images/templatemo_list_icon.gif"><font>Nurseries<font></li>
                    <li class="z2"><img src="images/templatemo_list_icon.gif"><font>Services<font></li>
                    <li class="z2"><img src="images/templatemo_list_icon.gif"><font>Weddings<font></li>
                    <li class="z2"><img src="images/templatemo_list_icon.gif"><font>Wholesale<font></li>
                </ul>
             </div>
             <div class="w3c">
             	<ul>
                	<li class="w3c1"><p>W3C Validations</p></li>
                    <li class="w3c2"><img src="images/234520160313214042.png"></li>
                </ul>
             </div>
             <div class="footer">
             	<ul>
                	<li class="footer1"><img src="images/mastercard.gif"></li>
                    <li class="footer1"><img src="images/visa.gif"></li>
                    <li class="footer1"><img src="images/paypal.gif"></li>
                    <li class="footer1"><img src="images/verisignsecured.gif"></li>
                    <li class="footer3">|</li>
                    <li class="footer2">Copying &copy 2024 <a href="">Your Company Name</a> I Designed by <a href="">久图网</a></li>
                </ul>
             </div>
         </div>
    </div>
</body>
</html>
